import React from 'react';
import {
  Form,
  Modal,
  Card,
} from 'antd';
import DescriptionList from 'components/DescriptionList';
import styles from './index.less';
import moment from 'moment';
import { productType, purchaseType } from "utils/enumConfig";
import { LwjDownload } from 'components';
import { LwjUpload } from 'components';

const { Description } = DescriptionList;
const FormItem = Form.Item
const doDesignModal = ({
  currentContractDetail,
  onOk,
  form: {
    getFieldDecorator,
    validateFieldsAndScroll
  },
  ...doDesignModalProps
}) => {

  const handleSubmit = () => {
    validateFieldsAndScroll((err, values) => {
      if (!err) {
        values.version = currentContractDetail.version;
        onOk(values);
      }
    });
  };

  const modalOpts = {
    ...doDesignModalProps,
    onOk: handleSubmit
  }

  const xlsProps = {
    maxfile: 1,
    target: '/services/upload/order',
    uploadIcon: 'upload',
    accept:'image/*,.pdf,.dwg,.dwf,.zip,.rar',
    fileType: '',
    onChange(value) {
    },
    showUploadList: true
  }

  return (
    <Modal {...modalOpts}>
      {!_.isEmpty(currentContractDetail) && <Card bordered={false}>
        <DescriptionList
          title="设计信息"
          size="small"
          style={{ marginBottom: 32 }}>
          <Description term="合同号">{currentContractDetail.contractNum}</Description>
          <Description term="产品类型">{productType[currentContractDetail.productType]}</Description>
          <Description term="是否推送丽维家">{currentContractDetail.pushToOMSNeeded ? "是" : "否"}</Description>
          <Description term="采购方式">{purchaseType[currentContractDetail.purchaseType]}</Description>
          <Description term="合同签订时间">{moment(currentContractDetail.orderContractAt).format("YYYY-MM-DD HH:mm:ss")}</Description>
          <Description term="合同安装时间">{moment(currentContractDetail.installContractAt).format("YYYY-MM-DD HH:mm:ss")}</Description>
          {!currentContractDetail.designNeeded && <Description term="设计师姓名">{currentContractDetail.designerUserName}</Description>}
          {!currentContractDetail.designNeeded && <Description term="设计师手机号">{currentContractDetail.designerUserPhoneNum}</Description>}
          {currentContractDetail.designNeeded && <Description term="测量时间">{moment(currentContractDetail.measuredAt).format("YYYY-MM-DD HH:mm:ss")}</Description>}
          {currentContractDetail.designNeeded && <Description term="测量设计师姓名">{currentContractDetail.measureDesignerName}</Description>}
          {currentContractDetail.designNeeded && <Description term="测量设计师手机号">{currentContractDetail.measureDesignerPhoneNum}</Description>}
          {currentContractDetail.designNeeded && <Description term="测量图纸">{<LwjDownload title={'点击下载'} targetUrl={currentContractDetail.measuredPictureAttachment} />}</Description>}
          {currentContractDetail.designNeeded && <Description term="现场图片">{<LwjDownload title={'点击下载'} targetUrl={currentContractDetail.scenePictureAttachment} />}</Description>}
          {currentContractDetail.status === "DENIED_DESIGN" && <Description term="设计不通过原因">{currentContractDetail.designDeniedReason}</Description>}
          {currentContractDetail.status === "DENIED_DESIGN" && <Description term="设计方案">{<LwjDownload title={'点击下载'} targetUrl={currentContractDetail.designAttachment} />}</Description>}
        </DescriptionList>
        <div className={styles.title}>请上传设计方案</div>
        <Form onSubmit={handleSubmit} hideRequiredMark>
          <FormItem label="设计方案">
            {getFieldDecorator('designAttachment', {
              rules: [
                {
                  required: true,
                  message: '请上传设计方案',
                }
              ]
            })(<LwjUpload multiple={true} {...xlsProps} />)}
          </FormItem>
        </Form>
      </Card>}
    </Modal>
  )
}

export default Form.create()(doDesignModal);
